import { Component, OnInit, Input, ViewChild } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { ActivatedRoute, Router } from '@angular/router';
import { StorageService } from '../sevices/storage.service';
import { NgForOf } from '@angular/common';

@Component({
  selector: 'app-details',
  templateUrl: './details.component.html',
  styleUrls: ['./details.component.scss']
})
export class DetailsComponent implements OnInit {
  public id: any; // 接收商品id
  public src: any; // 图片地址
  public parList: any [] = []; // 获取的详情
  public par: any; // 详情内容
  public estList = []; // 评价列表
  public num: any; // 评价数量
  public showPar = true; // 显示详情
  public showEst = false; // 显示评价

  // 加入购物车
  public ifAdd = false; // 显示和关闭加入购物车
  public addNum = 1; // 加购数量
  public canSub = true; // 如果加购数量等于一，关闭减一按钮
  public hadNum = 0; // 购物车有多少商品


  constructor(
    public http: HttpClient,
    public route: ActivatedRoute,
    public router: Router,
    private storage: StorageService,
    ) { }

  ngOnInit() {
    // 获取点击商品的id
    this.route.queryParams.subscribe((list) => {
      this.id = list.id;
    });
    // 获取商品详情
    const url: any = 'http://192.168.2.228:8080/goods/detail?id=' + this.id;
    this.http.get(url).subscribe((Response: any) => {
      this.parList = Response.data;
      // tslint:disable-next-line: no-string-literal
      this.src = this.parList['g_img'];
      // tslint:disable-next-line: no-string-literal
      this.par = this.parList['g_details'];
    });

    // 获取评论
    const api = 'http://192.168.2.228:8080/appraise/list?goods_id=' + this.id;
    this.http.get(api).subscribe((Response: any) => {
      this.estList = Response.data.list;
      this.num = this.estList.length;
    });
    // 获取购物车里边有多少件商品
    const api1 = 'http://192.168.2.228:8080/shoppingcart/personal?user_id=' + this.storage.getItem('user').u_id;
    this.http.get(api1).subscribe((Response: any) => {
      // tslint:disable-next-line: prefer-for-of
      for (let i = 0; i < Response.data.length; i ++) {
        // tslint:disable-next-line: no-string-literal
        this.hadNum += Response.data[i].goods_count;
      }
    });
  }

  // 改变显示详情和评价的方法
  goShowPar() {
    this.showPar = true;
    this.showEst = false;
  }
  goShowEst() {
    this.showEst = true;
    this.showPar = false;
  }
  // 加购数量减一
  subOne() {
    if (this.addNum !== 1) {
      this.addNum --;
    } else {
      this.canSub = true;
    }
  }
  // 加购数量加一
  addOne() {
    this.canSub = false;
    this.addNum ++;
  }
  // 点击加入购物车后显示加购页面
  checkedBack(e) {
    this.ifAdd = e;
  }
  // 点击关闭图标关闭
  closeAdd() {
    this.ifAdd = false;
  }
  // 选择好数量确认加入购物车
  ok() {
    if (this.storage.getItem('user')) { // 表示用户已经登录，
      // 获取本地用户数据
      const user = this.storage.getItem('user');
      const url = 'http://192.168.2.228:8080/shoppingcart/add';
      const httpOptions = { headers: new HttpHeaders({ 'Content-Type': 'application/json' }) };
      this.http.post(url, { user_id: user.u_id, goods_id: this.id, goods_count: this.addNum }, httpOptions).subscribe();
      this.ifAdd = false; // 关闭加购页面
      this.hadNum += (this.addNum * 1); // addNum转化为数字并加到hadNum中
    } else {
      // 未登录跳转到登录页面
      this.router.navigate(['/register']);
    }

  }
}


